<template>
	<view style="min-height: 100.1vh">
		<uni-search-bar v-model="searchValue" bgColor="#fff" placeholder="搜索" style="height: 80rpx;margin: 0rpx 20rpx;"
		@confirm="onSearchConfirm">
		</uni-search-bar>

		<view style="margin: 0rpx 20rpx;height: 100%;">
			<view
				style="background-color: #fff;margin: 20rpx; padding: 20rpx; border-radius: 10rpx; margin-top: 30rpx;">
				<uni-segmented-control :current="typeCurrent" :values="items" :style-type="styleType"
					:active-color="activeColor" @clickItem="onClickItem" />
			</view>
			<view class="content">
				<view v-if="typeCurrent === 0">
					<view v-for="(item,index) in maintenanceData1" :key="index">
						<view
							style="background-color: #fff;margin-bottom: 20rpx;border-radius: 10rpx;padding:10rpx 20rpx;width: 100%;">
							<view style="display:flex;">

								<view style="margin: 30rpx 20rpx;width: 100%;">
									<view style="display: flex;margin-bottom: 10rpx;">
										<view style="font-size: 26rpx;color: #A8A8A8;width: 80%;">
											计划编号：{{item.scheduleNum}}
										</view>
										<view style="width: 20%;">
											<view
												style="color: #3F92FA;font-size: 22rpx;width: 100%;padding:5rpx 5rpx ;text-align: center;font-weight: 400;background-color: #F5F5FF;border-radius: 5rpx;">
												{{item.period}}
											</view>
										</view>
									</view>
									<view style="border-bottom: 1rpx solid #ececec;"></view>

									<view style="margin-top: 20rpx;font-size: 26rpx;">
										{{item.equipmentName}}({{item.building}})
									</view>
									<view style="margin-top: 10rpx;color: #A8A8A8;font-size: 22rpx;">
										{{item.maintenanceText}}
									</view>
									<view style="margin-top: 10rpx;color: #A8A8A8;font-size: 22rpx;">
										上次保养日期：<span style="color: #000000;">{{changeTime(item.lastTime)}}</span>
									</view>
									<view style="margin-top: 10rpx;color: #A8A8A8;font-size: 22rpx;">
										下次保养日期：<span style="color: #3F92FA;">{{changeTime(item.nextTime)}}</span></view>
								</view>

							</view>
						</view>

					</view>
				</view>
				<view v-if="typeCurrent === 1">
					<view v-for="(item,index) in maintenanceData1" :key="index">
						<view
							style="background-color: #fff;margin-bottom: 40rpx;border-radius: 5rpx;padding:10rpx 20rpx;width: 100%;">
							<view style="display:flex;">
								<view style="width: 20%;">
									<image src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png"
										style="width: 120rpx;height: 120rpx;margin-top: 30rpx;"></image>
								</view>
								<view style="margin: 10rpx 10rpx;width: 80%;">
									<view style="display: flex;margin-bottom: 10rpx;">
										<view style="font-size: 26rpx;color: #A8A8A8;width: 80%;">
											单号：{{item.serialNo}}
										</view>
										
										<view style="width: 20%;">
											<view v-if="item.status == '已完成'"
												style="color: #3F92FA;font-size: 26rpx;width: 100%;padding:5rpx 5rpx ;text-align: center;font-weight: 400;background-color: #F5F5FF;border-radius: 5rpx;">
												{{item.status}}
											</view>
											<view v-else
												style="color: #D63F37;font-size: 26rpx;width: 100%;padding:5rpx 5rpx ;text-align: center;font-weight: 400;background-color: #FAEFEE;border-radius: 5rpx;">
												{{item.status}}
											</view>
										</view>
									</view>
									<view style="border-bottom: 1rpx solid #ececec;"></view>
									
									<view style="color: #3E3C50;font-size: 26rpx;margin-top: 10rpx;">
										{{item.deviceName}}({{item.structureName}})
									</view>
									<view style="color: #A8A8A8;font-size: 24rpx;margin-top: 10rpx;">{{item.faultDetails}}</view>
									<view style="color: #A8A8A8;font-size: 22rpx;margin-top: 10rpx;">{{changeTime(item.handleTime)}}
									</view>
								</view>
								
							</view>
						</view>

					</view>
				</view>
			</view>
			<view v-if="isFinish" style="text-align: center;">加载更多</view>
			<view v-if="isNoMore" style="text-align: center;">——没有更多数据啦——</view>
		</view>
	</view>

	</view>
</template>

<script>
	import {
		queryEquipmentMaintenancePlan,
		queryProduceRepair
	} from "@/api/index"
	export default {
		data() {
			return {
				form: {},
				current: 0,
				maintenanceData1: [],
				typeCurrent: 0,
				searchValue: null,
				activeColor: '#727e8b',
				styleType: 'button',
				items: [
					'保养计划', '保养工单'
				],
				pageSize: 2,
				pageNum: 0,
				pageTotal: 0,
				isFinish: false,
				isNoMore: false,
			}
		},
		onReady() {
			var a = {};
			a.currentIndex = 0
			this.onClickItem(a);
		},
		methods: {
			 onSearchConfirm(text) {
				 
				 this.searchValue = text.value;
				 this.getData();
			        console.log('搜索内容:', text);
			        // 在这里执行搜索逻辑
			      },
				  
			onClickItem(e) {
				uni.showLoading({
					title: '加载中'
				});
				console.log('oooo1ooooo', e.currentIndex)
				console.log('oooo2ooooo', this.typeCurrent)
				if (this.typeCurrent != e.currentIndex) {
					this.pageNum = 0;
					this.maintenanceData1 = []
				} else {

				}
				this.typeCurrent = e.currentIndex
				this.getData();

			},
			getData(){
				this.form.pageNum = this.pageNum
				this.form.pageSize = this.pageSize
				if (this.typeCurrent == 0) {
					this.form.building = this.searchValue;
					this.form.pageNum = this.pageNum
					this.form.pageSize = this.pageSize
					if(this.form.pageNum == 0 ){
						this.maintenanceData1= []
					}
					queryEquipmentMaintenancePlan(this.form).then(response => {
						console.info('cccccccccccccc', response)
						this.isFinish = false;
						this.maintenanceData1 = this.maintenanceData1.concat(response);
						this.pageTotal = response.total;
						if (this.pageTotal <= this.pageNum * this.pageSize) {
							this.isNoMore = true;
						}
						setTimeout(function() {
							uni.hideLoading();
						}, 500);
					})
				} else {
					this.form.type = '保养';
					if (this.typeCurrent == 0) {
						this.form.status = '正在审批';
					} else {
						this.form.status = '已完成';
					}
					console.info('wwwwwwwwwwwww', this.form)
					queryProduceRepair(this.form).then(response => {
						console.info('cccccccccccccc', response)
						this.isFinish = false
						this.maintenanceData1 = this.maintenanceData1.concat(response);
						this.pageTotal = response.total;
						if (this.pageTotal <= this.pageNum * this.pageSize) {
							this.isNoMore = true;
						}
						console.log('上拉加载停止')
						uni.stopPullDownRefresh()
						setTimeout(function() {
							uni.hideLoading();
						}, 500);
					})
				}
			},
			changeTime(e) {
				let date = new Date(e);
				let year = date.getFullYear();
				let month = (date.getMonth() + 1).toString().padStart(2, '0'); // 月份从0开始，需要加1，然后使用padStart方法补齐两位
				let day = date.getDate().toString().padStart(2, '0'); // 使用padStart方法补齐两位
				let hours = date.getHours().toString().padStart(2, '0'); // 获取小时并补齐两位数
				let minutes = date.getMinutes().toString().padStart(2, '0'); // 获取分钟并补齐两位数
				let second = date.getSeconds().toString().padStart(2, '0');
				let formattedDate = `${year}-${month}-${day} ${hours}:${minutes}:${second}`;
				return formattedDate;
			},
			onNavigationBarButtonTap(e) {
				console.info("aaaaaaaaaaaa", this.typeCurrent)
				if (this.typeCurrent == 0) {
					uni.navigateTo({
						url: '/pages/index/addMaintenancePlan'
					})
				} else {
					uni.navigateTo({
						url: '/pages/index/addMaintenance'
					})
				}
			}, // 下拉刷新
			onPullDownRefresh() {
				console.log('下拉刷新')
				var a = {};
				a.currentIndex = this.typeCurrent
				this.onClickItem(a);
				setTimeout(() => {
					console.log('下拉刷新停止')
					uni.stopPullDownRefresh()
				}, 2000)
			},
			
		}

	}
</script>

<style>
	.content {
		border-radius: 5px;
		padding: 0rpx 20rpx;
	}
</style>